<template>
    <view class="mylist">
        <!-- <view class="tabBox">
            <image class="banner4" :src="bannerUrl" style="width: 100%;"></image>
            <view class="tabName">我的借款记录</view>
        </view>
        <view class="result_box">
            <view class="tabItem" v-for="item in tableList" style="margin-bottom: 10px;" v-if="tableList.length != 0">
                <view class="formData">
                    <view class="formLabel">借款金额</view>
                    <view class="formValue">{{ item.amount }}</view>
                </view>
                <view class="formData">
                    <view class="formLabel">借款用途</view>
                    <view class="formValue">{{ item.reason }}</view>
                </view>
                <view class="formData">
                    <view class="formLabel">担保人</view>
                    <view class="formValue">{{ item.guaName }}</view>
                </view>
                <view class="formData">
                    <view class="formLabel">进度</view>
                    <view class="formValue" :class="fontColor(item.status)">{{ item.status | fiterStatus }}</view>
                </view>
            </view>
            <view v-if="tableList.length == 0" style="text-align: center;color: #67c23a; font-size: 20px">暂无借款记录</view>
        </view> -->
        <view class="tabBox">
            <image class="successBg" :src="bannerUrl" style="width: 50%;margin-left: 25%;"></image>
            <view class="successMsg">提交成功</view>
            <!-- <view class="tabName">申请借款信息</view> -->
        </view>
    </view>
</template>
<script>
export default {
    data() {
        return {
            bannerUrl: require('./success.png'),
            tableList: []
        }
    },
    filters: {
        fiterStatus(val) {
            if (val == 1) {
                return '已担保，未审核'
            } else if (val == 2) {
                return '拒绝担保'
            } else if (val == 3) {
                return '审核通过'
            } else if (val == 4) {
                return '审核拒绝'
            } else if (val == 5) {
                return '已还款'
            } else {
                return '未担保'
            }
        },
        fiterReason(val) {
            if (val == 1) {
                return '新骑手日维度生活费'
            } else if (val == 2) {
                return '生活费'
            } else if (val == 3) {
                return '垫付车辆租金'
            } else {
                return ''
            }
        }
    },
    mounted() {
        // this.getLoanList()
    },
    methods: {
        fontColor(val) {
            if(val == 1 || val == 3){
                return 'successColor'
            }else if(val == 2 || val == 4){
                return 'errorColor'
            }
        },
        // async getLoanList() {
        //     let res = await this.$api.jiekuan.getLoanList('3');
        //     this.tableList = res.data.rows;
        // },
    }
}
</script>
<style lang="scss">
.mylist {
    .tabBox {
        position: relative;

        uni-image {
            height: 200rpx;
        }

        .tabName {
            color: #fff;
            font-size: 24px;
            margin: 0;
            padding-left: 30px;
            padding-top: 30px;
            position: absolute;
            top: 0;
            left: 80px;
        }
    }
    .result_box {
        margin: 10px;
        .formData {
            border-top: 2px solid #333;
            border-left: 2px solid #333;
            border-right: 2px solid #333;
            overflow: hidden;
            line-height: 40px;
            min-height: 40px;
            max-height: 80px;

            .formLabel {
                float: left;
                width: calc(30% - 2px);
                text-align: center;
                height: 100%;
            }

            .formValue {
                float: left;
                width: 70%;
                height: 100%;
                text-align: center;
                border-left: 2px solid #333;
            }

            &:nth-of-type(4) {
                border-bottom: 2px solid #333;
            }
        }
        .successColor{
            color: #67C23A;
        }
        .errorColor{
            color: #F56C6C;
        }
    }
    .successBg {
        margin-top: 26%;
    }
    .successMsg {
        color: #2D7FFC;
        font-size: 16px;
        margin-top: 2%;
        font-family: PingFangSC-Semibold;
        font-weight: bold;
        text-align: center;
    }
    .successInfo {
        width: 90%;
        margin: 0 auto;

        p {
            font-size: 14px;
            line-height: 21px;
        }
    }
}
</style>